* {
    margin: 0;
    padding: 0;
    font-size: 16px;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
  }

  html, body {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
  }
  
  ul, li {
    list-style: none;
  }

  .F12 {
    font-size: 12px;
  }

  .F14 {
    font-size: 14px;
  }

  .F16 {
    font-size: 16px;
  }

  .F18 {
    font-size: 18px;
  }

  .F20 {
    font-size: 20px;
  }

  .MR5 {
    margin-right: 5px;
  }
  .MR10 {
    margin-right: 10px;
  }
  .MR15 {
    margin-right: 15px;
  }
  .MR20 {
    margin-right: 20px;
  }
  
  .ML5 {
    margin-left: 5px;
  }
  .ML10 {
    margin-left: 10px;
  }
  .ML15 {
    margin-left: 15px;
  }
  .ML20 {
    margin-left: 20px;
  }
  
  .MT5 {
    margin-top: 5px;
  }
  .MT10 {
    margin-top: 10px;
  }
  .MT15 {
    margin-top: 15px;
  }
  .MT20 {
    margin-top: 20px;
  }
  
  .ML5 {
    margin-left: 5px;
  }
  .ML10 {
    margin-left: 10px;
  }
  .ML15 {
    margin-left: 15px;
  }
  .ML20 {
    margin-left: 20px;
  }
  
  .PR5 {
    padding-right: 5px;
  }
  .PR10 {
    padding-right: 10px;
  }
  .PR15 {
    padding-right: 15px;
  }
  .PR20 {
    padding-right: 20px;
  }
  
  .PL5 {
    padding-left: 5px;
  }
  .PL10 {
    padding-left: 10px;
  }
  .PL15 {
    padding-left: 15px;
  }
  .PL20 {
    padding-left: 20px;
  }
  
  .PT5 {
    padding-top: 5px;
  }
  .PT10 {
    padding-top: 10px;
  }
  .PT15 {
    padding-top: 15px;
  }
  .PT20 {
    padding-top: 20px;
  }
  
  .PL5 {
    padding-left: 5px;
  }
  .PL10 {
    padding-left: 10px;
  }
  .PL15 {
    padding-left: 15px;
  }
  .PL20 {
    padding-left: 20px;
  }

  .flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .fixed {
    position: fixed;
  }